<div id="network-supply-analysis-bar9" style="height: 100%">

</div>

<script type="text/javascript">
    $(function () {
        loadbar9();
        $("select#prjId").change(function(){
            loadbar9();
        });
    });
    function loadbar9() {
        var center=$("#prjId").val();
        $.ajax({
            url: "#springUrl('/network/supply/analysis/bar9')",
            data: {"center": center},
            type: "POST",
            success: function (text) {
                var d = JSON.parse(text);
                if (d.success && d.data) {
                    var myChart = echarts.init(document.getElementById('network-supply-analysis-bar9'), 'macarons');
                    option = {
                        title: {
                            show:false,
                            text: '特性示例：渐变色 阴影 点击缩放',
                            subtext: 'Feature Sample: Gradient Color, Shadow, Click Zoom'
                        },
                        xAxis: {
                            data: d.data.x1,
                            axisLabel: {
                                inside: true,
                                textStyle: {
                                    color: '#fff'
                                }
                            },
                            axisLine: {
                                show: false
                            },
                            axisLabel:{
                                show:false
                            },
                            axisTick: {
                                show: false
                            },
                            z: 10
                        },
                        yAxis: {
                            axisLine: {
                                show: false
                            },
                            axisTick: {
                                show: false
                            },
                            axisLabel: {
                                textStyle: {
                                    color: '#999'
                                }
                            }
                        },
                        dataZoom: [
                            {
                                type: 'inside'
                            }
                        ],
                        grid:{
                            x:45,
                            y:40,
                            x2:50,
                            y2:60, borderWidth:10
                        },
                        series: [
                            {
                                type: 'bar',
                                itemStyle: {
                                    normal: {color: 'rgba(0,0,0,0.05)'}
                                },
                                barGap:'-100%',
                                barCategoryGap:'40%',
                                data: d.data.x1,
                                animation: false
                            },
                            {
                                type: 'bar',
                                itemStyle: {
                                    normal: {
                                        color: new echarts.graphic.LinearGradient(
                                            0, 0, 0, 1,
                                            [
                                                {offset: 0, color: '#83bff6'},
                                                {offset: 0.5, color: '#188df0'},
                                                {offset: 1, color: '#188df0'}
                                            ]
                                        )
                                    },
                                    emphasis: {
                                        color: new echarts.graphic.LinearGradient(
                                            0, 0, 0, 1,
                                            [
                                                {offset: 0, color: '#2378f7'},
                                                {offset: 0.7, color: '#2378f7'},
                                                {offset: 1, color: '#83bff6'}
                                            ]
                                        )
                                    }
                                },
                                data: d.data.x2
                            }
                        ]
                    };
                    myChart.setOption(option);
                }
            }
        });
    }

</script>